<template>
  <div class="left-nav">
    <a-menu :defaultSelectedKeys="['0']" mode="inline" theme="dark" :inlineCollapsed="collapsed">
      <template v-for="(item ) in menuList ">
        <template v-if=" user.username=='admin' ||authMenus.indexOf(item.key) !== -1">
          <a-menu-item v-if="item.children===undefined" :key="item.key">
            <a-icon type="pie-chart" />
            <router-link :to="item.key" tag="span">{{ item.title }}</router-link>
          </a-menu-item>

          <a-sub-menu v-if="item.children!==undefined" :key="item.key">
            <span slot="title">
              <a-icon type="mail" />
              <span>{{item.title}}</span>
            </span>
            <a-menu-item v-for="(menu) in item.children" :key="menu.key">
              <router-link :to="menu.key" tag="span">{{ menu.title }}</router-link>
            </a-menu-item>
          </a-sub-menu>
        </template>
      </template>
    </a-menu>
  </div>
</template>
<script>
import menuList from "../../config/menuConfig";
import storageUtil from "../../utils/storageUtil";
export default {
  props: ["collapsed","user"],
  data() {
    return {
      menuList,
      authMenus: [],
    };
  },
  created() {
    this.authMenus = this.user.role.menus;
  }
};
</script>

<style lang="stylus" scoped></style>
